<template>
	<view class="" >
		<slot name="list" :list="list"></slot>
		<view v-if="list.length==0" class="row flex-center" style="width: 100vw;height: 100vw;">
			<gt-img :src="$var.apiUrl+'/img/nodata.png'" class="w-h-150"></gt-img>
		</view>
		<view class="t-center" v-show="loading">{{ $t('加载中') }}</view>
	</view>
</template>

<script>
	export default {
		name: "gt-list",
		props: {
			config: {
				type: Object,
				default: {
					listUrl: ''
				}
			},
		},
		data() {
			return {
				list: [],
				pageInfo: {
					page: 0,
					totalPage: 1
				},
				noMore: false,
				loading: false,
			}
		},
		created() {
			this.getData();
		},
		methods: {
			getData() {
				if (!this.config.listUrl) {
					console.log('config.listUrl is null');
					return false;
				}
				if (this.loading || this.noMore || this.pageInfo.page >= this.pageInfo.totalPage) return false;
				var _this = this;
				this.loading = true;
				this.pageInfo.page = parseInt(this.pageInfo.page) + 1;
				this.$get({
					url: this.config.listUrl+'?page='+this.pageInfo.page,
					data: this.config.params || {},
					afterFun: function(resp) {
						_this.pageInfo = resp.pageInfo;
						_this.list.push.apply(_this.list, resp.list);
						_this.loading = false;
						if (resp.pageInfo.totalPage <= resp.pageInfo.page) {
							_this.noMore = true;
						}
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
</style>